<template>
  <div class="nav">
    <router-link to="/" :class="{car : routeName==arrys[0]}"><i class="icon-yxq"></i><br>一小群</router-link>
    <router-link to="/dynamic/main" :class="{car : routeName==arrys[1]}"><i class="icon-dongtai"></i><br>动态</router-link>
    <router-link to="/my" :class="{car : routeName==arrys[2]}"><i class="icon-wo"></i><br>我</router-link>
  </div>
</template>

<script>
  export default {
    name: 'nav',
    data () {
      return {
          routeName : this.$route.name,
          arrys : ['home','dynamic','my']
      }
    },
    mounted (){

    },
    methods : {

    }
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  @import "../assets/css/common.scss";
  .nav{
    position: fixed;bottom: 0;width: 100%;max-width: $sreen;padding: 0 10%;box-sizing: border-box;height: rem(100);background-color: #fff;
    a{float: left;width: 33.33%;text-align: center;font-size: rem(20);height: 100%;color: $black-light;
      i{font-size: rem(50);margin-top: rem(16);display: inline-block;}
      &.car{color: $blue;}
    }
  }
</style>
